<template>
  <div ref="echarts" style="width: 100%;height: 100%;">
  </div>
</template>
<script>

  import * as echarts from "echarts";

  export default {
    data() {
      return {
        option : {
          color: [
            '#37A2DA',
            // '#32C5E9',
            // '#67E0E3',
            // '#9FE6B8',
            '#FFDB5C',
            '#ff9f7f',
            '#fb7293',
            '#E062AE',
            '#E690D1',
            '#e7bcf3',
            '#9d96f5',
            '#8378EA',
            '#96BFFF'
          ],
          title: {
            text: '当前一小时PCBA点数完全率',
            subtext: '60%',
            left: 'center'
          },
          tooltip: {
            trigger: 'item'
          },
          legend: {
            orient: 'vertical',
            left: 'left'
          },
          series: [
            {
              name: '',
              type: 'pie',
              radius: '50%',
              data: [
                { value: 1048, name: '已焊点数' },
                { value: 735, name: '未焊点数' },
              ],
              emphasis: {
                itemStyle: {
                  shadowBlur: 10,
                  shadowOffsetX: 0,
                  shadowColor: 'rgba(0, 0, 0, 0.5)'
                }
              }
            }
          ]
        }
      }
    },
    created: function () {

    },
    mounted() {
      this.getEcharts();
    },

    methods: {
      getEcharts() {
        const myEcharts = echarts.init(this.$refs.echarts);
        myEcharts.setOption(this.option);
      },

    }
  }

</script>

<style>



</style>
